<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>	Туристичний онлайн-сервіс "Метрдотель"</title>
<meta name="description" content="Real estate website">
<meta name="keywords" content="real, estate">
<link href="css/mystyle.css" rel="stylesheet" type="text/css">
<!--
  jQuery library
-->
<script type="text/javascript" src="lib/jquery-1.4.2.min.js"></script>
<!--
  jCarousel library
-->
<script type="text/javascript" src="lib/jquery.jcarousel.min.js"></script>
<!--
  jCarousel skin stylesheet
-->
<link rel="stylesheet" type="text/css" href="skins/tango/skin.css" />

<script type="text/javascript">

jQuery(document).ready(function() {
    jQuery('#mycarousel').jcarousel();
	
});

</script>
<script type="text/javascript">

jQuery(document).ready(function() {
    $('#mycarousel li img').click(function(){
    var str = $(this).attr('src');
	$('#bigPic').attr('src',str);
	});
	
});

</script>
<script>
</script>
</head>
<body>
<div id="page">
  <div id="menu"><table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td width="10"><img src="images/ml.gif" alt="" width="10" height="41"></td>
    <td class="item"><a href="index.html">Про сервіс</a></td>
    <td width="20"><img src="images/ms.gif" alt="" width="20" height="41"></td>
    <td class="item"><a href="catalog.html">Каталог готелів</a></td>
    <td width="20"><img src="images/ms.gif" alt="" width="20" height="41"></td>
    <td class="item"><a href="galery.html">Галерея</a></td>
    <td width="20"><img src="images/ms.gif" alt="" width="20" height="41"></td>
    <td class="item"><a href="form.html">Форма бронювання</a></td>
    <td width="20"><img src="images/ms.gif" alt="" width="20" height="41"></td>
    <td class="item"><a href="#">FAQ</a></td>
    <td width="20"><img src="images/ms.gif" alt="" width="20" height="41"></td>
    <td class="item"><a href="#">Контакти</a></td>
    <td width="10"><img src="images/mr.gif" alt="" width="10" height="41"></td>
  </tr>
</table>
</div>
<div id="header">
	<div id="logo"><img src="images/logo.gif"></div>
    <div id="company_name">"Метрдотель"</div>
    <div id="company_name_shaddow">"Метрдотель"</div>
    <div id="intro">Онлайн - сервіс "МЕТРДОТЕЛЬ" призначений для здійснення швидкого та зручного бронювання готелю в будь-якому куточку України, не відходячи від свого робочого місця. Ми допомагаємо Вам, йти в ногу з часом!<br>
</div>
	
</div>
<div id="body_area">
	 <div id="content_area">
	  <h1 align="center">Галерея зображень</h1>
<div align="center">
<ul id="mycarousel" class="jcarousel-skin-tango" >
    <li><img src="images/1.jpg" width="75" height="75" alt="" /></li>
     <li><img src="images/2.jpg" width="75" height="75" alt="" /></li>
	   <li><img src="images/3.jpg" width="75" height="75" alt="" /></li>
	     <li><img src="images/4.jpg" width="75" height="75" alt="" /></li>
		   <li><img src="images/5.jpg" width="75" height="75" alt="" /></li>
  </ul>
  </div>
  <div align="center" style="margin-top:20px">
  <img src="images/1.jpg" width="400" height="400" id="bigPic" style= "border: 10px solid #935179;">
  </div>
	  
	 </div>
	 <div style="width:1px; height:300px;float:left; background-color:#000000;"></div>
	 <div id="side_bar">
	 <div align="center" style="font-size:18px">Форма входу</div>
		<table>
			<tr> 
				<td>Логін</td>
				<td><input type="text" size="15" placeholder="Login"/></td>
			</tr>
			<tr> 
				<td>Логін</td>
				<td><input type="password" size="15" placeholder="password"/></td>
			</tr>
			<tr> 
				<td colspan = "2" align ="center"><input type = "submit" name="Ok" value="Вхід"></td>
			</tr>
			<tr> 
				<td colspan = "2" align ="center"><a href="#">Створити акаунт</a></td>
			</tr>
		</table>
	 </div>
	 <div style="clear:both"></div>
</div>
<div id="footer">
  <div id="bottom_menu"><a href="index.html">Про сервіс</a> |  <a href="catalog.html">Каталог готелів</a>  |  <a href="#">Галерея</a>  |  <a href="#">Форма бронювання</a> |  <a href="#">FAQ</a>  | <a href="#">Контакти</a></div>
  <div id="bottom_addr">© 2010 Metrdotel. Всі права захищені</div>
</div>
<div class="pagebottom"></div>
</div>

</body>
</html>
